import defaultSettings from '@/settings/index';

// 导入 Element Plus 中英文语言包
import zhCn from 'element-plus/es/locale/lang/zh-cn';
import en from 'element-plus/es/locale/lang/en';
import { store } from '@/store';
import { DeviceEnum, SidebarStatusEnum } from '@/enums';

export const useAppStore = defineStore('app', () => {
  // 设备类型
  const device = useStorage('device', DeviceEnum.DESKTOP);
  // 布局大小
  const size = useStorage('size', defaultSettings.size);
  // 语言
  const language = useStorage('language', defaultSettings.language);
  // 侧边栏状态
  const sidebarStatus = useStorage('sidebarStatus', SidebarStatusEnum.CLOSED);
  const sidebar = reactive({
    opened: sidebarStatus.value === SidebarStatusEnum.OPENED,
    withoutAnimation: false,
  });

  // 顶部菜单激活路径
  const activeTopMenuPath = useStorage('activeTopMenuPath', '');

  // 是否锁屏、锁屏密码
  const isLockScreen = useStorage('isLockScreen', false);
  const lockScreenPassword = useStorage<string | undefined>('lockScreenPassword', undefined);

  /** 锁屏 */
  function lockScreen(password: string) {
    isLockScreen.value = true;
    lockScreenPassword.value = password;
  }
  /** 解锁 */
  function unlockScreen() {
    isLockScreen.value = false;
    lockScreenPassword.value = undefined;
  }

  /**
   * 根据语言标识读取对应的语言包
   */
  const locale = computed(() => {
    if (language?.value == 'en') {
      return en;
    } else {
      return zhCn;
    }
  });

  /** 切换侧边栏 */
  function toggleSidebar() {
    sidebar.opened = !sidebar.opened;
    sidebarStatus.value = sidebar.opened ? SidebarStatusEnum.OPENED : SidebarStatusEnum.CLOSED;
  }

  /** 关闭侧边栏 */
  function closeSideBar() {
    sidebar.opened = false;
    sidebarStatus.value = SidebarStatusEnum.CLOSED;
  }

  /** 打开侧边栏 */
  function openSideBar() {
    sidebar.opened = true;
    sidebarStatus.value = SidebarStatusEnum.OPENED;
  }

  /** 切换设备 */
  function toggleDevice(val: string) {
    device.value = val;
  }

  /**
   * 改变布局大小
   * @param val 布局大小 default | small | large
   */
  function changeSize(val: string) {
    size.value = val;
  }
  /**
   * 切换语言
   * @param val
   */
  function changeLanguage(val: string) {
    language.value = val;
  }
  /**
   * 混合模式顶部切换
   */
  function activeTopMenu(val: string) {
    activeTopMenuPath.value = val;
  }
  return {
    device,
    sidebar,
    language,
    locale,
    size,
    isLockScreen,
    lockScreenPassword,
    activeTopMenu,
    toggleDevice,
    changeSize,
    changeLanguage,
    toggleSidebar,
    closeSideBar,
    openSideBar,
    activeTopMenuPath,
    lockScreen,
    unlockScreen,
  };
});

/**
 * 用于在组件外部（如在Pinia Store 中）使用 Pinia 提供的 store 实例。
 * 官方文档解释了如何在组件外部使用 Pinia Store：
 * https://pinia.vuejs.org/core-concepts/outside-component-usage.html#using-a-store-outside-of-a-component
 */
export function useAppStoreHook() {
  return useAppStore(store);
}
